<!--
 * @Autor: dingxiaolin
 * @Date: 2021-06-10 16:45:57
 * @LastEditors: dingxiaolin
 * @LastEditTime: 2021-06-28 15:43:21
-->
<template>
  <a-spin :spinning="spinning">
    <a-tree
      v-if="props.treeData.length"
      style="min-height: 40px"
      :tree-data="props.treeData"
      :replace-fields="replaceFields"
      :defaultExpandAll="true"
      :defaultExpandedKeys="defaultExpandedKeys"
      @select="handleClick"
    />
    <a-empty :image="simpleImage" v-else />
  </a-spin>
</template>

<script lang='ts'>
import {
  defineComponent,
  PropType,
  reactive,
  toRefs,
  ref,
  computed,
  nextTick,
  onMounted
} from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from '@/store'
import { Empty } from 'ant-design-vue'
import { getOrgTree } from '@/api/system/user'

export default defineComponent({
  name: 'posTree',
  components: {},
  props: {
    treeData: {
      type: Array,
      default: []
    },
    selfLoading: {
      type: Boolean,
      default: false
    }
  },
  emits: ['emitId'],
  setup(props, ctx) {
    const router = useRouter()
    const store = useStore()
    const state = reactive({
      treeData: [],
      defaultExpandedKeys: [],
      spinning: false,
      replaceFields: {
        key: 'id'
      }
    })
    onMounted(() => {
      //   if (props.selfLoading) {
      //     state.spinning = true
      //     getOrgTree().then((res) => {
      //       state.spinning = false
      //       state.treeData = res
      //     })
      //   }
    })
    /**
     * 点击左侧机构树查询列表
     */
    function handleClick(e) {
      ctx.emit('emitId', e.toString())
    }
    return {
      ...toRefs(state),
      props,
      handleClick,
      simpleImage: Empty.PRESENTED_IMAGE_SIMPLE
    }
  }
})
</script>

<style lang='scss' scoped>
</style>
